const fs = require('fs');
const path = require('path');

//匹配<style></style>标签的正则  \s表示空白字符  \S表示非空白字符  *表示匹配任意次数   结合起来就是所有字符
const regStyle = /<style>[\s\S]*<\/style>/;
const regScript = /<script>[\s\S]*<\/script>/;

function resolveCSS(data) {
    const style = regStyle.exec(data); //将匹配的内容提取出来 它用于在字符串中执行正则表达式搜索,并返回匹配的结果
    const css = style[0].replace('<style>', '').replace('</style>', '');
    fs.writeFile(path.join(__dirname, 'index.css'), css, (err) => {
        console.log(err);
    });
}

function resolveJs(data) {
    const script = regScript.exec(data);
    const js = script[0].replace('<script>', '').replace('</script>', '');
    fs.writeFile(path.join(__dirname, 'index.js'), js, (err) => {
        console.log(err);
    });
}

function resolveHTML(data) {
    //将数据抽离 单独文件引入
    const html = data.replace(regStyle, '<link rel="stylesheet" href="./index.css" />').replace(regScript, '<script src="./index.js"></script>');
    fs.writeFile(path.join(__dirname, 'index1.html'), html, (err) => {
        console.log(err);
    });
}
fs.readFile(path.join(__dirname, '/index.html'), 'utf8', (err, data) => {
    if (data) {
        //读取文件后 将html文件里的css js 类型抽出来
        resolveCSS(data);
        resolveJs(data);
        resolveHTML(data);
    }
});
